<%--
  Created by IntelliJ IDEA.
  Admin: XBB
  Date: 2021/2/18
  Time: 14:04
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/layui/css/layui.css">

    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/layui_ext/dtree/dtree.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/layui_ext/dtree/font/dtreefont.css">
</head>
<body>
<div style="padding: 10px">

    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend>查询条件</legend>
    </fieldset>
    <form  class="layui-form">
        <div class="layui-form-item">
            <div class="layui-form-item">
                <label class="layui-form-label">账号名称</label>
                <div class="layui-input-inline">
                    <input type="text" name="adminName"   placeholder="请输入账号名称" autocomplete="off" class="layui-input">
                </div>
                <label class="layui-form-label">姓名</label>
                <div class="layui-input-inline">
                    <input type="text" name="realName"   placeholder="请输入姓名" autocomplete="off" class="layui-input">
                </div>
                <label class="layui-form-label">身份证号</label>
                <div class="layui-input-inline">
                    <input type="text" name="adminIdCard"   placeholder="请输入身份证号" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item" style="text-align: right">
                <button  class="layui-btn layui-btn-normal layui-icon layui-icon-search layui-btn-radius layui-btn-sm" lay-submit lay-filter="doSearch">查询
                </button>
                <button type="reset" class="layui-btn layui-btn-warm layui-icon layui-icon-refresh layui-btn-radius layui-btn-sm">重置
                </button>
            </div>
        </div>
    </form>

    <table id="adminTable" lay-filter="adminTableFilter"></table>
</div>

<script id="toolbaradmin" type="text/html">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="adminAdd">添加</button>
        <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="deleteSome">批量删除</button>
    </div>
</script>

<script id="baradmin" type="text/html">
    <a class="layui-btn layui-btn-xs layui-btn-radius" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-warm layui-btn-xs layui-btn-radius" lay-event="resetPwd">重置密码</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs layui-btn-radius" lay-event="del">删除</a>
    <a class="layui-btn layui-btn-warm layui-btn-xs layui-btn-radius" lay-event="allotRole">分配角色</a>
</script>

<!-- 添加和修改的弹出层开始 -->
<div style="display: none;padding: 20px" id="saveOrUpdateDiv">
    <form class="layui-form" lay-filter="dataFrm" id="dataFrm">
        <div class="layui-form-item">
            <label class="layui-form-label">账号名:</label>
            <div class="layui-input-block">
                <input type="hidden" name="adminId">
                <input type="text" name="adminName" placeholder="请输入账号名" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">密码:</label>
            <div class="layui-input-block">
                <input type="text" name="adminPwd" placeholder="请输入密码" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">姓名:</label>
            <div class="layui-input-block">
                <input type="text" name="realName" placeholder="请输入用户姓名" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">职位:</label>
            <div class="layui-input-block">
                <input type="text" name="position" placeholder="请输入职位" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">身份证号:</label>
            <div class="layui-input-block">
                <input type="text" name="adminIdCard" placeholder="请输入用户身份证号" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block" style="text-align: center;padding-right: 120px">
                <button type="button" class="layui-btn layui-btn-normal layui-btn-md layui-icon layui-icon-release layui-btn-radius" lay-filter="doSubmit" lay-submit="">&nbsp; 提交</button>
                <button type="reset" class="layui-btn layui-btn-warm layui-btn-md layui-icon layui-icon-refresh layui-btn-radius">&nbsp; 重置</button>
            </div>
        </div>
    </form>
</div>

<%--用户分配角色的弹出层开始--%>
<div style="display: none;padding: 20px" id="allotRole">
    <div class="layui-form-item">
        <table id="roleTable" lay-filter="roleTableFilter"></table>
    </div>
</div>


<script type="text/javascript" src="${pageContext.request.contextPath}/static/layui/layui.js"></script>
<script>

    var adminTab;
    var adminIndex;
    var title;

    layui.extend({
        dtree: '${pageContext.request.contextPath}/static/layui_ext/dtree/dtree'   //{/}代表采用自有路径
    }).use(['form','layer','jquery','table','dtree'],function() {
        var form = layui.form, layer = layui.layer, $ = layui.jquery,table = layui.table , dtree = layui.dtree;

        adminTab = table.render({
            elem:"#adminTable"
            ,url:"${pageContext.request.contextPath}/sysAdmin/admin/adminRightJson"
            ,cols:[[
                {type:'checkbox'}
                ,{field:'adminId',title:'用户ID',align:"center",sort:true}
                ,{field:'adminName',title:'账号',align:"center"}
                ,{field:'adminPwd',title:'账号密码',align:"center"}
                ,{field:'adminIdCard',title:'身份证号',align:"center"}
                ,{field:'position',title:'职位',align:"center"}
                ,{field:'realName',title:'姓名',align:"center"}
                ,{field:'type',title:'管理员类型',align:"center",templet:function (r) {
                        return r.type == 1 ? '超级管理员':'普通管理员'
                    }}
                ,{fixed:'right',title:'操作',align:"center",toolbar:'#baradmin',minWidth:300}
            ]]
            ,toolbar:'#toolbaradmin'
            ,page:true
            ,limit:[5,10,15]
            ,limit:5
        })

        //给查询按钮添加事件
        form.on('submit(doSearch)',function (data) {

            adminTab.reload({
                where:data.field
                ,page:{curr:1}
            })

            return false;
        })

        //监听头部工具栏
        table.on('toolbar(adminTableFilter)',function (obj) {
            if(obj.event == "adminAdd"){
                adminAdd()
            }else if(obj.event == "deleteSome"){
                //获取选中的行
                var checkStatus = table.checkStatus(obj.config.id)
                if(checkStatus.data.length == 0){
                    layer.msg("至少选择一行数据")
                    return false
                }
                //获取所有选中的adminId
                var str = ""
                for(var i = 0;i<checkStatus.data.length;i++){
                    var admin = checkStatus.data[i];
                    str += admin.adminId + ","
                }
                deleteSome(str,checkStatus.data.length)
            }
        })
        
        function deleteSome(str,count) {
            layer.confirm("您确定要删除这"+count+"条数据吗？",{icon:2,title:'批量删除'},function(i){
                $.post("${pageContext.request.contextPath}/sysAdmin/admin/deleteSomeAdmin",{"adminIds":str},function(r){
                    if(r.code == 0){
                        //删除成功
                        layer.msg(r.msg, {
                            offset: '15px'
                            ,icon: 1
                            ,time: 1000
                        }, function(){
                            // 刷新table
                            adminTab.reload({
                                page:{curr:1}
                            })
                        });
                    }else{
                        //删除失败
                        layer.msg(r.msg)
                    }
                })
            })
        }

        //点击添加按钮的弹出
        function adminAdd() {
            adminIndex = layer.open({
                type:1
                ,title:"添加用户"
                ,area:['700px','700px']
                ,content:$('#saveOrUpdateDiv')
            })
            //清除表单的内容
            $("#dataFrm").get(0).reset()
            $("#adminId").val("")
            form.render()
            title = "添加"
        }

        //给弹出层的form表单submit按钮添加点击事件
        form.on('submit(doSubmit)',function (obj) {
            layer.confirm("您确定要"+title+"吗？",function () {
                $.post("${pageContext.request.contextPath}/sysAdmin/admin/adminAddOrUpdate",obj.field,function (r) {
                    if(r.code == 0){
                        layer.msg(r.msg,{
                            offset:'15px'
                            ,icon:1
                            ,time:1000
                        },function () {
                            //关闭当前弹出框
                            layer.close(adminIndex)
                            //刷新table
                            adminTab.reload({
                                page:{curr:1}
                            })
                        });
                    }else{
                        layer.msg(r.msg)
                    }

                })
            })
            return false;
        })

        //监听行工具栏
        table.on('tool(adminTableFilter)',function (obj) {
            if(obj.event == "edit"){
                edit(obj.data)
            }else if(obj.event == "del"){
                del(obj.data)
            }else if(obj.event == "allotRole"){
                allotRole(obj.data)
            }else if(obj.event == "resetPwd"){
                resetPwd(obj.data)
            }
        })

        var roleTab;

        //分配角色
        function allotRole(data) {
            adminIndex = layer.open({
                type:1
                ,title:"分配"+data.realName+"角色"
                ,area:['700px','400px']
                ,content:$('#allotRole')
                ,btn:['确认分配','取消分配']
                ,btnAlign: 'c'
                ,success:function (index, layero) {
                    //渲染数据表格
                    roleTab = table.render({
                        elem:"#roleTable"
                        ,title:"角色列表"
                        ,url:"${pageContext.request.contextPath}/sysAdmin/admin/roleAllJson?adminId="+data.adminId
                        ,cols:[[
                            {type:'checkbox'}
                            ,{field:'roleId',title:'角色ID',align:"center",sort:true}
                            ,{field:'roleName',title:'角色名称',align:"center"}
                            ,{field:'roleDesc',title:'角色简介',align:"center"}
                            , {field: 'available', title: '是否可用',   align:"center",templet:function (r){
                                    return r.available== 1 ? '可用' : '<span style="color:red">不可用</span>'
                                } }
                        ]]
                    })
                }
                ,yes:function (index,layero) {
                    //获取所有复选框的角色ID
                    var checkStatus = table.checkStatus(roleTab.config.id);
                    var arr = checkStatus.data;
                    var roleIds = ""
                    var count = 0
                    for(var i = 0;i<arr.length;i++){
                        roleIds += arr[i].roleId+","
                        count++;
                    }
                    if(count == 0){
                        layer.msg("至少选择一个角色",{
                            offset:"15px"
                            ,icon:1
                            ,time:1000
                        })
                        return false;
                    }

                    // 把角色编号和所有选中的菜单传到后台
                    $.post("${pageContext.request.contextPath}/sysAdmin/admin/updRoleByAdminId",{"adminId":data.adminId,"roleIds":roleIds},function (r) {
                        if(r == "1"){
                            layer.close(adminIndex)
                            layer.msg("分配成功", {
                                offset: '15px'
                                ,icon: 1
                                ,time: 1000
                            })
                        }
                    })
                }
                ,btn2:function (index, layero) {
                    layer.close(adminIndex)
                    return false;
                }
            })
        }

        //点击编辑
        function edit(data) {
            adminIndex = layer.open({
                type:1
                ,title:"修改用户"
                ,area:['700px','500px']
                ,content:$('#saveOrUpdateDiv')
            })

            //给表单设置值
            form.val('dataFrm',data)
            $('[name="name"]').val(data.title)
            $("#adminId").val(data.parentId)
            form.render()
            title = "修改"
        }

        //点击删除
        function del(data){
            layer.confirm("确定删除"+data.adminName+"吗？",function (i) {
                $.post("${pageContext.request.contextPath}/sysAdmin/admin/adminDelete",{"id":data.adminId},function (r) {
                    if(r.code == 0){
                        layer.msg(r.msg,{
                            offset:'15px'
                            ,icon:1
                            ,time:1000
                        },function () {
                            //关闭当前弹出框
                            layer.close(adminIndex)
                            //刷新table
                            adminTab.reload({
                                page:{curr:1}
                            })
                        });
                    }else{
                        layer.msg(r.msg)
                    }

                })
            })
        }

        //重置密码弹出层
        function resetPwd(data) {
            layer.confirm("确定重置 "+data.realName+" 的密码为：123 吗？",function (i) {
                $.post("${pageContext.request.contextPath}/sysAdmin/admin/resetAdminPwd",{"id":data.adminId},function (r) {
                    if(r.code == 0){
                        layer.msg(r.msg,{
                            offset:'15px'
                            ,icon:1
                            ,time:1000
                        },function () {
                            //关闭当前弹出框
                            layer.close(adminIndex)
                            //刷新table
                            adminTab.reload({
                                page:{curr:1}
                            })
                        });
                    }else{
                        layer.msg(r.msg)
                    }

                })
            })
        }
    })
</script>
</body>
</html>

